<extend name="Layout/ins_page" />
<block name="content">
	<style>
		.tag_list {
			padding-left: 15px;
			padding-right: 15px;
			padding-bottom: 20px;
		}
		.layui-tab-title li {
			min-width: auto;
		}
	</style>
	{:W('PageHeader/search',array('name'=>'供应商'))}
	<div class="oprator-panel">
		<a class="btn" onclick="import_contact();">导入</a>
		<div class="split"></div>
		<a class="btn" id="btn_add">新建</a>
		<span class="l">|</span>
		<a class="btn btn-del" id="btn_del" >删除</a>
	</div>
	<div class="layui-tab layui-tab-brief" id="select_letter">
		<ul class="layui-tab-title">
			<li>
				全部
			</li>
			<li>
				A
			</li>
			<li>
				B
			</li>
			<li>
				C
			</li>
			<li>
				D
			</li>
			<li>
				E
			</li>
			<li>
				F
			</li>
			<li>
				G
			</li>
			<li>
				H
			</li>
			<li>
				I
			</li>
			<li>
				J
			</li>
			<li>
				K
			</li>
			<li>
				L
			</li>
			<li>
				M
			</li>
			<li>
				N
			</li>
			<li>
				O
			</li>
			<li>
				P
			</li>
			<li>
				Q
			</li>
			<li>
				R
			</li>
			<li>
				S
			</li>
			<li>
				T
			</li>
			<li>
				U
			</li>
			<li>
				V
			</li>
			<li>
				W
			</li>
			<li>
				X
			</li>
			<li>
				Y
			</li>
			<li>
				Z
			</li>
			<li>
				#
			</li>
		</ul>
	</div>
	<div class="ul-table">
		<form method="post" name="form_data" id="form_data">
			<ul>
				<li class="thead">
					<span class="col-2 x-checkbox">
						<input type="checkbox" name="id[]" value="{$vo.id}" class="toggle-select-all" data="id[]">
					</span>
					<span class="col-16 grow-2">客户名称</span>
					<span class="col-8 grow-1 hidden-s">联系人</span>
					<span class="col-12 grow-1 hidden-s">办公电话</span>
					<span class="col-12 grow-1">手机</span>
				</li>
				<empty name="list">
					<li class="no-data">
						没找到数据
					</li>
					<else/>
					<foreach name="list" item="vo">
						<li class="tbody" letter="{$vo.letter}">
							<span class="col-2 x-checkbox">
								<input type="checkbox" name="id[]" value="{$vo.id}">
							</span>
							<span class="col-16 grow-2"><a href="{:U('read',array('id'=>$vo['id']))}">{$vo.name}</a></span>
							<span class="col-8 grow-1 autocut hidden-s">{$vo.contact}&nbsp;</span>
							<span class="col-12 grow-1 hidden-s">{$vo.office_tel}&nbsp;</span>
							<span class="col-12 grow-1"><a href="tel:{$vo.mobile_tel}">{$vo.mobile_tel}</a></span>
						</li>
					</foreach>
				</empty>
			</ul>
			<notempty name="list">
				<div class="pagination">
					{$page}
				</div>
			</notempty>
		</form>
	</div>
</block>
<block name="js">
	<script type="text/javascript">
		layui.use(['global','element'], function() {
		var $=layui.jquery;
		set_return_url(null);
		$('#select_letter li').on('click', function() {
		var search_letter=trim(this.innerText);
		if(search_letter=='全部') {
		$('#form_data li.tbody').show();
		} else {
		$('#form_data li.tbody').hide();
		$('#form_data li.tbody').each(function() {
		console.log(this);
		var key=$(this).attr('letter').substr(0,1);
		if(search_letter==key) {
		$(this).show();
		}
		});
		}
		});
		$('.tag_list li').click(function(event) {
		event.stopPropagation();
		});
		$("li.tbody").click(function() {
		$(".table input:checkbox").attr("checked",false);
		$(".tag_list input[name='tag[]']").attr("checked",false);
		str=trim($(this).find(".tag").text());
		strs=str.split(",");
		for( i=0;i<strs.length;i++) {
		$(".tag_list input[name='tag[]'][value='"+strs[i]+"']").prop("checked",true);
		}
		});
		$('.tag_list input').on('change', function(event) {
		if(($('.tag_list input:checked').length==0)&&($(".tag_list input[name='new_tag']").val()=="")) {
		$(".cmd").show();
		$(".apply").hide();
		} else {
		$(".cmd").hide();
		$(".apply").show();
		}
		});
		$("#btn_add").on('click', function() {
		window.open("{:U('add')}","_self");
		});
		$('#btn_del').on('click', function() {
		if($("input[name='id[]']:checked").length==0) {
		layer.msg('请选择要删除的数据');
		return false;
		}
		//信息框-例2
		layer.msg('确定要删除吗?', {
		time:0,btn:['确定','取消'],yes: function(index) {
		var vars=$("#form_data").serialize();
		send_ajax("{:U('del')}",vars, function(ret) {
		if(ret.status) {
		layer.msg(ret.info, function() {
		location.reload(true);
		});
		}
		});
		},no: function(index) {
		layer.close(index);
		}
		});
		});
		$('#btn_select_pid').on('click', function() {
		winopen("{:U('winpop')}",560,470);
		});
		});
		function apply() {
		if($("#form_data .ul-table input:checked").length==0) {
		ui_error("请选择数据");
		return false;
		}
		send_form("form_data","{:U('set_tag')}","{:U('index')}");
		}
		function create_new_tag() {
		$(".cmd").hide();
		$(".new_tag").css("display","block");
		$(".apply").show();
		}
		function export_contact() {
		window.open("{:U('export')}","_blank");
		return false;
		}
		function import_contact() {
		window.open("{:U('import')}","_self");
		return false;
		}
		function manage_tag() {
		window.open("{:U('tag_manage')}","_self");
		return false;
		}
	</script>
</block>